// pages/detail/index.js
const api = require("../../utils/api.js");
const _http = require("../../utils/request.js");
const QQMapWX = require('../../utils/qqmap-wx-jssdk.js');
let qqmapsdk = new QQMapWX({
    key: 'DHABZ-AJTCQ-URZ5X-GSHDR-6OMVJ-JXBUK' // 必填
})
Page({

  /**
   * 页面的初始数据
   */
  data: {
    longitude: '',
    latitude: '',
    startIcon: '../../image/start.png',
    endIcon: '../../image/end.png',
    markers: [],
    covers: [],
    polyline: [],
    id: '',
    recordDetail: {},
    points:[],
    startPoint: {
      longitude: '',
      latitude: ''
    },
    endPoint: {
      longitude: '',
      latitude: ''
    }
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    console.log(options)
    this.setData({
      id: options.id 
    }, () => {
      this.getRecordDetail()
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  },
  getRecordDetail () {
    console.log(this.data.id)
    _http(`${api.recordDetail}/${this.data.id}`, 'get', {}).then(res => {
        wx.hideLoading();
        this.setData({
          recordDetail: res.data.returnObject.info,
          startPoint: {
            longitude: res.data.returnObject.info.startSiteLon,
            latitude: res.data.returnObject.info.startSiteLat,
          },
          endPoint: {
            longitude: res.data.returnObject.info.endSiteLon,
            latitude: res.data.returnObject.info.endSiteLat,
          },
          points: [
            {
              longitude: res.data.returnObject.info.startSiteLon,
              latitude: res.data.returnObject.info.startSiteLat,
            },
            {
              longitude: res.data.returnObject.info.endSiteLon,
              latitude: res.data.returnObject.info.endSiteLat,
            }
          ],
          markers: [
            {
              id: 1,
              longitude: res.data.returnObject.info.startSiteLon,
              latitude: res.data.returnObject.info.startSiteLat,
              iconPath: this.data.startIcon,
              width: 22,
              heihgt: 36
            },
            {
              id: 2,
              longitude: res.data.returnObject.info.endSiteLon,
              latitude: res.data.returnObject.info.endSiteLat,
              iconPath: this.data.endIcon,
              width: 22,
              heihgt: 36
            },
          ]
        }, () => {
          this.getWalk();
        });
    })
  },
  getWalk () {
    let _this = this;
    console.log(_this.data.startPoint)
    console.log(_this.data.endPoint)
    //调用距离计算接口
    qqmapsdk.direction({
        mode: 'walking',//可选值：'driving'（驾车）、'walking'（步行）、'bicycling'（骑行），不填默认：'driving',可不填
        //from参数不填默认当前地址
        from:  {
            // longitude: '108.33133154541015',
            // latitude: '22.829632051072952',
            latitude: _this.data.startPoint.latitude,
            longitude: _this.data.startPoint.longitude
          },
        to: {
            // longitude: 108.32339232205914,
            // latitude: 22.829618469052438
            latitude: _this.data.endPoint.latitude,
            longitude: _this.data.endPoint.longitude
        }, 
        success: function (res) {
            console.log(res);
            let ret = res;
            let coors = ret.result.routes[0].polyline, pl = [];
            //坐标解压（返回的点串坐标，通过前向差分进行压缩）
            var kr = 1000000;
            for (var i = 2; i < coors.length; i++) {
                coors[i] = Number(coors[i - 2]) + Number(coors[i]) / kr;
            }
            //将解压后的坐标放入点串数组pl中
            for (var i = 0; i < coors.length; i += 2) {
                pl.push({ latitude: coors[i], longitude: coors[i + 1] })
            }
            console.log(pl)
            
            //设置polyline属性，将路线显示出来,将解压坐标第一个数据作为起点
            _this.setData({
                latitude: pl[0].latitude,
                longitude: pl[0].longitude,
                polyline: [{
                    points: pl,
                    color: '#32B458',
                    width: 4
                }]
            })
        },
        fail: function (error) {
            console.error(error);
        },
        complete: function (res) {
            if (res.status !== 0) {
                wx.showToast({
                    title: res.message,
                    icon: 'none'
                })
            }
        }
    })
},
})